<template>
    <div class="enroll-page">
      <div class="enroll-page-header">
        <Header></Header>
      </div>
      <el-card class="box-card" style="width: 80%; margin: auto; margin-top: 20px"
        ><div
          style="font-size: 0.16rem; text-align: center; line-height: 32px"
          v-html="value"
        ></div>
      </el-card>
  
      <div class="enroll-page-bottom">
        <Bottom></Bottom>
      </div>
    </div>
  </template>
    
    <script>
  import Header from "@/components/header/header.vue";
  import Bottom from "@/components/bottom";
  export default {
    components: {
      Header,
      Bottom,
    },
  
    data() {
        return {
            value: '"<h1 style=\"margin-top:23px; margin-bottom:22px; text-align:justify\"><b><font face=\"宋体\">【望江童装网</font></b><b><font face=\"宋体\">分销合作协议书</font></b><b><font face=\"宋体\">】</font></b></h1>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">甲方：</font> <font face=\"宋体\">望江童装网</font><font face=\"宋体\">供应商会员</font> <font face=\"宋体\">（以下简称</font><font face=\"宋体\">&ldquo;甲方&rdquo;）</font></p>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">乙方：</font> <font face=\"宋体\">望江童装网</font><font face=\"宋体\">分销商会员</font> <font face=\"宋体\">（以下简称</font><font face=\"宋体\">&ldquo;乙方&rdquo;）</font></p>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">根据我国相关法律的规定，甲、乙双方经友好协商，在平等、自愿、公平、诚信、守法的原则下就甲、乙双方进行网络分销合作的具体事宜，达成如下一致协议：</font></p>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">一、合作内容</font></p>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">甲乙双方在资源共享和双赢的基础上进行合作。甲方按双方约定的价格提供分销商品，利用乙方的网店资源进行网络分销，并承诺按乙方提供地址按时发货；乙方负责介绍分销商品并促成交易成功。</font></p>\n\n<ul>\n\t<li style=\"text-align:justify\"><font face=\"宋体\">合作期限</font></li>\n</ul>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">从协议签定之日起，甲方应及时为乙方提供产品信息和服务。若甲方产品信息更改，甲乙双方可协商约定是否继续履约，否则双方权利义务关系即终止。若乙方主观行为导致甲方利益受损，甲乙双方应友好协商解决。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">三、商品质量</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">1.&nbsp;</font><font face=\"宋体\">甲方供应的分销商品质量应当符合中华人民共和国相关法律法规规定或行业规定的质量标准。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">2.&nbsp;</font><font face=\"宋体\">分销商品须与甲方事先所提供的样品或双方在正式合作前约定质量、品种及规格相符。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">3.&nbsp;</font><font face=\"宋体\">在售后服务期内，甲方的售后服务细则及标准，按甲方经营网店（</font><font face=\"宋体\">望江童装网</font><font face=\"宋体\">平台的店铺）之标准规范执行。如遇特殊情形，可双方另行协商。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">4.&nbsp;</font><font face=\"宋体\">因分销商品质量问题导致出现大量的售后服务所产生的费用，乙方可向甲方反馈并提供证明，甲乙双方应友好协商处理。经甲方确认同意后，可由乙方先行垫付，甲方直接给付乙方。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">四、交货</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">1.&nbsp;</font><font face=\"宋体\">交货地点：甲方按乙方指定地址自行发货或者交由代发机构发货。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">2.&nbsp;</font><font face=\"宋体\">运输方式；采用快递方式，运输费乙方承担。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">五、结算</font></p>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">甲乙双方的交易，结算行为均属线下行为，与</font><font face=\"宋体\">望江童装网</font><font face=\"宋体\">平台无关。双方在交易过程中出现交易纠纷应自行协商解决。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">六、双方的权责</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">1.&nbsp;</font><font face=\"宋体\">甲方的责任与义务：</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">1</font><font face=\"宋体\">）甲方承诺在接到乙方订单请求时，在甲乙双方共同约定工作日内，按乙方提供地址发货。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">2</font><font face=\"宋体\">）甲方应根据乙方的需要提供推动分销商品的销售资料以及信息，协助乙方获得必要的产品说明。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">3</font><font face=\"宋体\">）甲方有权监督产品的销售，并要求乙方予以改进，乙方须配合解决问题。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">4</font><font face=\"宋体\">）甲方更改分销商品供货价格，须提前通知乙方。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">5</font><font face=\"宋体\">）在协议有效期内，甲方不可以无故干扰乙方的分销工作。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">2.&nbsp;</font><font face=\"宋体\">乙方的责任与义务：</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">1</font><font face=\"宋体\">）乙方须通过不断完善、提高自身服务质量，提升其销售量。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">2</font><font face=\"宋体\">）乙方必须尊重甲方的商标权等知识产权。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">3</font><font face=\"宋体\">）乙方所使用甲方提供的资料和物品不得用于与双方所商定合作事项无关的事务上。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">4</font><font face=\"宋体\">）乙方确保不单方面使用甲方任何产品、资料、做与品牌网络分销无关的事宜。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">5</font><font face=\"宋体\">）乙方不得有损甲方的形象及声誉。因此而造成甲方的形象或声誉损害的，甲方有权随时终止协议，并追究乙方法律责任。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">6</font><font face=\"宋体\">）乙方不得随意对甲方产品进行变更或修改甲方产品的任何资料。因此而造成甲方权益损失的，甲方有权终止协议，并追究乙方的法律责任。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">七、保密协定</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">1.&nbsp;</font><font face=\"宋体\">除法律规定必须公开的资料以外，乙方不得向第三方展示甲方递交的有关资料和有损于甲方利益的情报。甲方不得向第三方泄漏乙方按本协议规定提供给甲方的经营秘密及有损乙方利益的情报。乙方有责任保证其员工不向第三方泄漏甲方秘密。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">2.&nbsp;</font><font face=\"宋体\">以上规定双方的保密义务在本协议期满后仍然有效。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">3.&nbsp;</font><font face=\"宋体\">甲乙任何一方违反上述保密义务，应当赔偿因此给对方造成的全部损失。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">八、协议的终止</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">1.&nbsp;</font><font face=\"宋体\">甲乙双方应按照本协议规定履行义务。如果甲乙任何一方违反本协议规定，并在对方发出书面通知之日起五个工作日内仍未及时改正的，非违约方有权取消违约方的合作资格，并可无条件终止本协议。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">2.&nbsp;</font><font face=\"宋体\">乙方如想单方面终止本协议，需向甲方提出书面申请材料，说明解除协议的原因，获得甲方批准后，本协议终止。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">九、通知送达</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">1.&nbsp;</font><font face=\"宋体\">任何一方向另一方发出与本协议有关的通知，可以挂号信、特快专递、电子邮件等方式发往另一方在甲乙双方网站上所确认的通知地址。通知被视为收到的日期约定如下：</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">1</font><font face=\"宋体\">）以挂号信件发出的，投递日（以邮戳为准）后的第</font><font face=\"Calibri\">7</font><font face=\"宋体\">天视为收件日期。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">2</font><font face=\"宋体\">）以特快专递发出的，发出当日（以快递公司签收日为准）后的第</font><font face=\"Calibri\">3</font><font face=\"宋体\">天视为收件日期。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">3</font><font face=\"宋体\">）以电子邮件发出的，发出当日视为收件日期。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">2.&nbsp;</font><font face=\"宋体\">各方确认通知地址为甲乙双方网站上所确认的地址，如果一方的通知地址发生变更，该方应将其通知地址变更的情况按上述方式通知其他各方后，该方的新通知地址生效。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">3.&nbsp;</font><font face=\"宋体\">若一方认为邮件&ldquo;内件品名&rdquo;载明的内容与邮件中的实际文件内容不符，应在收到邮件之日起</font><font face=\"Calibri\">3</font><font face=\"宋体\">个工作日内书面通知对方，逾期未通知对方则视为邮件&ldquo;内件品名&rdquo;载明的内容与邮件中文件内容一致。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"宋体\">十、其它</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">1.&nbsp;</font><font face=\"宋体\">本协议未尽事项，经双方协商，可另立补充协议。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">2.&nbsp;</font><font face=\"宋体\">凡因履行本协议或与本协议有关的任何争议，由本协议甲方所在地人民法院管辖。</font></p>\n\n<p style=\"text-align:justify\"><font face=\"Calibri\">3.&nbsp;</font><font face=\"宋体\">本协议经用户在线点击&ldquo;我已仔细阅读并同意本协议全部条款&rdquo;后生效。</font></p>\n\n<p style=\"text-align:justify\">&nbsp;</p>\n\n<p style=\"text-align:justify\">&nbsp;</p>\n\n<p style=\"border-bottom: 1pt double windowtext; padding: 0pt; text-align: center;\">&nbsp;</p>\n"',
        };
    },
    created() {},
  };
  </script>
    
  <style scoped lang="scss">
  @import "https://at.alicdn.com/t/c/font_3269139_cl7hle1i5at.css?spm=a313x.manage_type_myprojects.i1.9.33fe3a81OONzz5&file=font_3269139_cl7hle1i5at.css";
  /deep/ .el-progress-circle {
    width: 1rem !important;
    height: 1rem !important;
  }
  
  /deep/ .el-upload-list__item-actions {
    width: 1rem;
    height: 1rem;
  }
  
  /deep/ .el-upload-list__item-thumbnail {
    width: 1rem;
    height: 1rem;
  }
  
  /deep/ .el-upload-list__item {
    width: 1rem;
    height: 1rem;
  }
  
  .codeImg {
    width: 100px;
    height: 0.4rem;
    cursor: pointer;
  }
  
  .enroll-page {
    width: 100%;
    min-height: 100vh;
  
    &-header {
      width: 100%;
      height: 0.96rem;
    }
  
    &-main {
      width: 100%;
      min-height: 6.33rem;
      padding: 0.27rem 0rem;
      background: #f5f7f9;
      display: flex;
      justify-content: center;
      align-items: center;
  
      &-box {
        width: 12rem;
        min-height: 4.91rem;
        background: #ffffff;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
  
        .top {
          width: 12rem;
          min-height: 4.6rem;
          background: #ffffff;
          display: flex;
          justify-content: space-between;
          align-items: flex-start;
        }
  
        &-left {
          width: 4.63rem;
          min-height: 5.91rem;
          padding: 0 0.27rem;
          .xieyi {
            margin-left: 1rem;
            font-size: 0.14rem;
  
            display: flex;
            align-items: center;
          }
  
          .loginbutton {
            margin-top: 0.12rem;
            margin-left: calc(100% - 3.68rem);
            width: 70%;
            height: 0.4rem;
            border-radius: 0.02rem;
            opacity: 0.5;
            background: #e22a1f;
            text-align: center;
            line-height: 0.4rem;
            color: #ffffff;
            font-size: 0.16rem;
            letter-spacing: 0.04rem;
            cursor: pointer;
          }
  
          .form {
            .getCode {
              width: 100% !important;
              height: 0.4rem;
              margin-top: 0.07rem;
              display: flex;
              justify-content: space-between;
              align-items: center;
              position: relative;
  
              ::v-deep .el-input__inner {
                height: 0.4rem !important;
              }
            }
            ::v-deep .el-form-item {
              margin-bottom: 0.2rem;
            }
  
            .getCodeButton {
              width: 1.02rem;
              height: 0.38rem;
              line-height: 0.38rem;
              text-align: center;
              cursor: pointer;
              color: #fa5555;
              border: 1px solid #e22a1f;
              font-size: 0.12rem;
            }
  
            .message {
              margin-top: 0.15rem;
              width: 100%;
              text-align: center;
              font-family: PingFang SC;
              font-size: 0.14rem;
              color: #e22a1f;
              cursor: pointer;
            }
  
            .tologin {
              margin-top: 0.12rem;
              margin-left: calc(100% - 3.68rem);
              width: 3.68rem;
              text-align: left;
              color: #e22a1f;
              font-size: 0.16rem;
              cursor: pointer;
            }
          }
  
          ::v-deep .el-tabs__item {
            font-size: 0.16rem;
            font-weight: bold;
          }
  
          ::v-deep .el-tabs__item:hover {
            color: red !important;
          }
  
          ::v-deep .el-tabs__item.is-active {
            color: red !important;
          }
  
          ::v-deep .el-tabs__active-bar {
            height: 0.04rem;
            background-color: red !important;
          }
  
          ::v-deep .el-input__prefix {
            color: #3d3c3c !important;
          }
  
          ::v-deep .el-input__inner {
            height: 0.4rem !important;
          }
  
          ::v-deep .el-tabs__nav-wrap::after {
            background: none;
          }
        }
  
        &-right {
          margin-top: 0.33rem;
          margin-right: 0.32rem;
          width: 6.32rem;
          height: 4rem;
          background: #f9d4d2;
          display: flex;
          justify-content: center;
          align-items: center;
          position: relative;
  
          .logotext {
            font-size: 0.24rem;
            color: #ffffff;
            font-weight: 500;
            position: absolute;
            top: 0.12rem;
            left: 50%;
            transform: translateX(-50%);
            z-index: 10;
          }
  
          .logobg {
            width: 2.4965rem;
            height: 0.5118rem;
            position: absolute;
            top: 0rem;
            left: 50%;
            transform: translateX(-50%);
            z-index: 10;
          }
  
          &-msgbox {
            width: 94.62%;
            height: 91%;
            background: #ffffff;
            border-radius: 0.1rem;
            position: absolute;
            display: flex;
            justify-content: center;
            align-items: center;
  
            .text1 {
              font-size: 0.28rem;
              color: #e22a1f;
              position: absolute;
              top: 0.48rem;
              left: 2.12rem;
            }
  
            .text2 {
              font-size: 0.28rem;
              color: #e22a1f;
              position: absolute;
              top: 1.14rem;
              left: 0.43rem;
            }
  
            .text3 {
              font-size: 0.28rem;
              color: #e22a1f;
              position: absolute;
              top: 1.54rem;
              left: 0.2rem;
            }
  
            .text5 {
              font-size: 0.14rem;
              color: #e22a1f;
              position: absolute;
              top: 2.11rem;
              left: 0.18rem;
            }
  
            .text4 {
              width: 1.18rem;
              height: 0.36rem;
              line-height: 0.36rem;
              background: #e22a1f;
              text-align: center;
              font-size: 0.16rem;
              color: #ffffff;
              position: absolute;
              top: 2.41rem;
              left: 0.49rem;
            }
  
            .text6 {
              font-size: 0.18rem;
              color: #e22a1f;
              position: absolute;
              top: 3.15rem;
              left: 1.49rem;
            }
  
            .text7 {
              font-size: 0.18rem;
              font-weight: bold;
              color: #e22a1f;
              position: absolute;
              top: 1.15rem;
              left: 4.41rem;
            }
  
            .text8 {
              font-size: 0.28rem;
              color: #e22a1f;
              position: absolute;
              top: 1.45rem;
              left: 4.28rem;
            }
  
            .text9 {
              font-size: 0.28rem;
              color: #e22a1f;
              position: absolute;
              top: 1.84rem;
              left: 4.08rem;
            }
  
            .qrcodebox {
              width: 1.8rem;
              height: 1.8rem;
              border-radius: 0.1rem;
              background: #e22a1f;
              display: flex;
              justify-content: center;
              align-items: center;
  
              .qrcode {
                width: 90%;
                height: 90%;
              }
            }
          }
        }
  
        &-bottom {
          width: 10.7rem;
          padding: 0rem 1rem 0rem 0.3rem;
          min-height: 4rem;
          background: #ffffff;
  
          .enrollButton {
            margin-left: 1.2rem;
            width: 3.68rem;
            height: 0.4rem;
            line-height: 0.4rem;
            text-align: center;
            font-size: 0.16rem;
            font-weight: 500;
            color: #ffffff;
            border-radius: 0.02rem;
            background: #e22a1f;
            cursor: pointer;
          }
  
          .returnLogin {
            margin-left: 1.2rem;
            width: 3.68rem;
            height: 0.2rem;
            line-height: 0.2rem;
            text-align: left;
            font-size: 0.14rem;
            font-weight: 500;
            color: #e22a1f;
            cursor: pointer;
          }
  
          ::v-deep .el-form-item {
            display: flex;
          }
  
          ::v-deep .el-upload--picture-card {
            width: 1rem;
            height: 1rem;
            line-height: 1rem;
          }
        }
      }
    }
  
    &-bottom {
      width: 100%;
      height: 3.2rem;
    }
  }
  </style>
  
    